<template>
    <view class="record">
        <u-divider text="识别记录" textSize="40rpx"></u-divider>
    	<template v-if="recordList.length>0">
    	    <u-transition
    	    	:show="show" 
    	    	mode="fade-left" 
    	    	:duration="index>=2?index*200:500" 
    	    	v-for="(item,index) in recordList" 
    	    	:key="index"
    	    >
    	    	<view class="recordItem"  style="margin-top: 20rpx;">
    	           <!-- <image :src="item.thumb" style="width: 100%;height: 50vh;"></image> -->
                   <image src="/static/imgs/chenpi.jpg" style="width: 100%;height: 50vh;"></image>
                   
    	    	    <u-cell-group>
    	    	        <u-cell 
    	    	            icon="calendar-fill" 
    	    	            title="年份" 
    	    	            value="7年"
    	    	            size="large"
    	    	        >
    	    	        </u-cell>
    	    	        <u-cell 
    	    	            icon="rmb-circle-fill"
    	    	            title="价格" 
    	    	            value="960元/斤"
    	    	            size="large"
    	    	        >
    	    	        </u-cell>
    	    	        <u-cell 
    	    	            icon="home-fill"
    	    	            title="产地" 
    	    	            value="天马"
    	    	            size="large"
    	    	        >
    	    	        </u-cell>
    	    	        <u-cell 
    	    	            icon="hourglass-half-fill"
    	    	            title="当前状态" 
    	    	            value="识别完毕"
    	    	            size="large"
    	    	        >
    	    	        </u-cell>
    	    	    </u-cell-group>
    	    	</view>
    	    </u-transition>
    	</template>
        <template v-else>
            <view class="none">暂无识别记录</view>
        </template>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                show: false,
                recordList: null,
            };
        },
        beforeCreate() {
            const loginInfo = uni.getStorageSync("loginInfo") || null;
            if(!loginInfo){
                uni.getUserInfo({
                    desc:"test",
                    success(res) {
                        console.log(res)
                    }
                });
            }
        },
        onLoad() {
            let Info = uni.getStorageSync("uploadInfo") || null;
            Info = Info?JSON.parse(Info):[];
            this.recordList = Info;
            uni.showLoading({title:"Loading..."});
            setTimeout(()=>{
                uni.hideLoading();
                this.show = true;
            },1000)
        }
    }
</script>

<style lang="scss" scoped>
    .record{
        width: 90%;
        margin: auto;
        margin-top:50rpx;
        position: relative;
        .none{
            @include flexBox();
        }
        .bgi{
            position: absolute;
            top: 0;
            left: 0;
            z-index: -1;
            width: 100vw;
            height: 100vh;
        }
        .recordItem{
            width: 100%;
            margin-top:50rpx;
            border-left: 1px solid rgb(214, 215, 217);
            border-right: 1px solid rgb(214, 215, 217);  
            border-radius: 10rpx;
            &:first-child{
                margin-top:0;
            }
        }
    }
    .u-cell {
        border: 0 1px solid black !important;
    }
</style>
